<template>
  <a-card class="card-item empty" hoverable bordered>
    <div class="flex justify-between px-4 py-2 font-bold">
      <div>空床</div>
      <div class="bed-num">{{ bedCode }}</div>
    </div>
    <div class="flex-1 pb-4">
      <a-empty class="h-full flex items-center justify-center" description="" :image="Empty" />
    </div>
  </a-card>
</template>

<script setup>
import Empty from '@/assets/images/empty.png'

defineProps({
  bedCode: {
    type: String,
    default: ''
  }
})
</script>
<style lang="less" scoped>
.card-item {
  width: 300px;
  height: 227px;

  :deep(.ant-card-body) {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
    .bed-num {
      color: var(--primary-color);
    }
  }
}
</style>
